<template>
  <div>
    <vxe-grid ref="grid" :data="tableData"></vxe-grid>
    <vxe-pager
      background
      @page-change="handleCurrentChange"
      :current-page.sync="page.currentPage"
      :page-size.sync="page.pageSize"
      :layouts="[
        'PrevJump',
        'PrevPage',
        'JumpNumber',
        'NextPage',
        'NextJump',
        'Sizes',
        'FullJump',
        'Total',
      ]"
      :total="page.totalPage"
    ></vxe-pager>
  </div>
</template>

<script>
import { helpTextList } from '@/api'; // 导入后端接口方法

export default {
  data() {
    return {
      tableData: [], // 表格数据
      page: {
        currentPage: 1, // 当前页码
        pageSize: 10, // 每页显示数量
        totalPage: 0 // 总页数
      },
      queryForm: {
        textTitle: '', // 搜索条件
        textLabel: [], // 其他搜索条件
        selectedItem: []
      }
    };
  },
  mounted() {
    // 页面初始化时获取数据
    this.getTextList();
  },
  methods: {
    getTextList() {
      const params = {
        userId: store.getters.user_id.toString(),
        token: store.getters.token.toString(),
        data: {
          textBussinessTypeCode: 111,
          pageSize: this.page.pageSize,
          currentPage: this.page.currentPage,
          textTitle: this.queryForm.textTitle,
        },
      };
      if (this.queryForm.textLabel.length || this.searchkeys.length || this.selectedItem.length) {
        params.data.textLabel = this.queryForm.textLabel.join(',') || this.searchkeys.join(',') || this.selectedItem;
      }
      helpTextList(params).then((data) => {
        if (data.result) {
          this.tableData = data.resultdata.data;
          this.image = data.resultdata.data.textThumbnail;
          this.page.totalPage = data.resultdata.count;
        }
      });
    },
    handleCurrentChange({ currentPage, pageSize }) {
      // 选择跳转多少页
      this.page.currentPage = currentPage;
      this.page.pageSize = pageSize;
      this.getTextList();
    },
  },
};
</script>
